<!-- eslint-disable vue/valid-v-model -->
<template>
  <el-dialog
    :title="form.account ? '修改合作商' : '新增合作商'"
    :visible="visible"
    @close="closeFn"
  >
    <el-form class="form" ref="form" :model="form" width="200px">
      <el-form-item prop="code" label="货品类型编码">
        <el-input
          :disabled="true"
          placeholder="请输入"
          v-model="form.code"
        ></el-input>
      </el-form-item>
      <!--                                    联系人                     -->
      <el-form-item prop="contact" label="货品类型名称">
        <el-input placeholder="请输入" v-model="form.name"></el-input>
      </el-form-item>
    </el-form>

    <div slot="footer" class="dialog-footer">
      <el-button class="btn" round @click="closeFn">取 消</el-button>
      <el-button class="btn" round type="primary" @click="submite"
        >确 定</el-button
      >
    </div>
  </el-dialog>
</template>

<script>
import { Postlist, Putlist } from '@/api/item.js'

export default {
  data () {
    return {
      form: {
        code: '',
        name: ''
      }
    }
  },
  async created () {
    // const {
    //   data: { data }
    // } = await Hp()
    // this.form.code = data
    // console.log(this.form.code)
  },
  methods: {
    closeFn () {
      this.$emit('closeFn')
    },
    async submite () {
      if (this.form.id) {
        await Putlist(this.form)
          .then(() => {
            this.$refs.form.resetFields()
            this.form.code = ''
            this.form.name = ''
            this.$message.success('成功了')
            this.closeFn()
          })
          .catch((res) => {
            this.$message(res)
          })
      } else {
        await Postlist(this.form)
          .then(() => {
            this.$refs.form.resetFields()
            this.form.code = ''
            this.form.name = ''
            this.$message.success('成功了')
            this.closeFn()
          })
          .catch((res) => {
            this.$message(res)
          })
      }
    }
  },
  props: {
    visible: {
      type: Boolean,
      required: true
    }
  }
}
</script>

<style lang="scss" scoped>
.el-button--primary {
  color: #fff;
  background-color: #ffb200;
  border-color: #ffb200;
}
::v-deep .el-input__inner {
  height: 40px;
  line-height: 40px;
  border: 1px solid #f8f5f5;
  background: #f8f5f5;
  border-radius: 6px;
}
::v-deep .el-form-item__label {
  height: 35px;
  font-size: 12px;
}
::v-deep .el-dialog {
  border-radius: 5px;
  width: 30%;
  // height: 530px;
}
::v-deep .el-col {
  height: 38px;
  // padding: 15px;
}
::v-deep .el-form-item__label {
  width: 100px;
}
::v-deep .el-dialog__body {
  padding: 10px 30px;
}
.a1 {
  width: 79%;
}
::v-deep .el-form-item {
  margin-bottom: 10px;
  // margin-left: 10px;
}
.a2 {
  padding-top: 10px;
  padding-left: 100px;
  width: 60%;
}
</style>
